<!-- 定制开发请联系客服微信：csmszf -->
<template>
	<view>
		<u-tabs
		        :list="list1"
				class="def-bg"
		        lineWidth="30"
		        lineColor="#f56c6c"
		        :activeStyle="{
		            color: '#303133',
		            fontWeight: 'bold',
		            transform: 'scale(1.05)'
		        }"
		        :inactiveStyle="{
		            color: '#606266',
		            transform: 'scale(1)'
		        }"
		        itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;"
		    >
		</u-tabs>
		<view class="flex justify-between py-2 px-8 def-bg">
			<view class="flex flex-col justify-center justify-items-center items-center p-1">
				<view><image src="../../../static/imgs/msg/like.png" class="icon-img-32"></image></view>
			    <view>喜欢</view>
			</view>
			<view class="flex flex-col justify-center justify-items-center items-center p-1">
				<view><image src="../../../static/imgs/msg/comment.png" class="icon-img-32"></image></view>
				<view>评论</view>
			</view>
			<view class="flex flex-col justify-center justify-items-center items-center p-1">
				<view><image src="../../../static/imgs/msg/fans.png" class="icon-img-32"></image></view>
				<view>粉丝</view>
			</view>
			<view class="flex flex-col justify-center justify-items-center items-center p-1">
				<view><image src="../../../static/imgs/msg/notice.png" class="icon-img-32"></image></view>
				<view>通知</view>
			</view>
		</view>
		<view class="bg-white rounded-md mt-1">
			<u-list height="auto">
				<u-list-item>
					<u-cell title="接待员-菲菲" label="遇到一个不要车子,房子,存款...">
						<image slot="icon" src="../../../static/logo.png" style="width: 70rpx; height: 70rpx;" />
						<view slot="right-icon" class="flex-col">
							<view class="flex justify-end justify-items-center">
								上午 08:20
							</view>
							<view class="flex justify-end justify-items-center mt-1">
								 <u-badge numberType="overflow"  :type="type" max="99" :value="value"></u-badge>
							</view>
						</view>
					</u-cell>
				</u-list-item>
				<u-list-item>
					<u-cell label="欢迎来到IM APP！">
						<view slot="title" class="flex justify-start justify-items-start">
							<text>系统号</text><text class="iconfont iconfont-system" style="width: 22px; height: 22px;"></text>
						</view>
						<image slot="icon" src="../../../static/logo.png" style="width: 70rpx; height: 70rpx;" />
						<view slot="right-icon" class="flex-col">
							<view class="flex justify-end justify-items-center">
								16:20
							</view>
							<view class="flex justify-end justify-items-center mt-1">
								 <u-badge numberType="overflow"  :type="type" max="99" :value="value"></u-badge>
							</view>
						</view>
					</u-cell>
				</u-list-item>
			</u-list>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type:"error",
				value:10,
				list1: [{
					name: '消息',
				}, {
					name: '通话',
				}]
			}
		},
		methods: {
			click(item) {
				console.log('item', item);
			}
		}
	}
</script>

<style lang="scss">
.text{
	height: 60rpx;
	background-color: blue;
}
</style>
